<template>
  <div class="evaluation-info">
    <el-card>
      <template #header>
        <div class="header">
          <h3>评分管理</h3>
          <div class="header-right">
<!--            <div class="header-right-select-title">选择学期:</div>-->
<!--            <el-select v-model="currentSemester" placeholder="选择学期" style="width: 150px">-->
<!--              <el-option-->
<!--                v-for="item in semesterOptions"-->
<!--                :key="item.value"-->
<!--                :label="item.label"-->
<!--                :value="item.value"-->
<!--              />-->
<!--            </el-select>-->
          </div>
        </div>
      </template>
      <router-view v-slot="{ Component }">
        <keep-alive>
          <component :is="Component" />
        </keep-alive>
      </router-view>
    </el-card>
  </div>
</template>

<script setup>
import { ref, watch, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import myAxios from '../../../plugins/myAxios'

const router = useRouter()
const currentSemester = ref('')
const semesterOptions = [
  { label: '2023-2024-1', value: '2023-2024-1' },
  { label: '2023-2024-2', value: '2023-2024-2' }
]

// // 监听学期变化
// watch(currentSemester, (newVal) => {
//   if (newVal) {
//     // 将选中的学期保存到 sessionStorage
//     sessionStorage.setItem('currentSemester', newVal)
//     // 触发子组件重新获取数据
//     router.replace({ query: { semester: newVal }})
//   }
// })
//
// // 组件挂载时，获取已保存的学期
// onMounted(() => {
//   myAxios.get("/admin/evaluation/getSemesterList",{}).then(res => {
//     if(res.length === 0){
//       semesterOptions.value = [];
//     }
//     semesterOptions.value = res.map(item => {
//       let option = {};
//       option.label = item;
//       option.value = item;
//       return option;
//     })
//
//     const savedSemester = sessionStorage.getItem('currentSemester')
//     if (savedSemester) {
//       currentSemester.value = savedSemester
//     } else {
//       // 默认选择第一个学期
//       currentSemester.value = semesterOptions[0].value
//     }
//   })
//
// })
</script>

<style scoped>
.evaluation-info {
  padding: 20px;
}
.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header-right {
  display: flex;
  gap: 10px;
}
.header-right-select-title{
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 14px;
}

</style> 